<div class='form-wrapper'>
    <?php echo form_open('grading/school_year/list_students/'.$section_list_id.'/'.$year); ?>
    <div class='float-left half-width-g '>
        <select id="available-student" multiple="multiple" class="max-width list-selector">
            <?php foreach ($students as $s) : ?>
                <option value='<?php echo $s->id; ?>'><?php echo $s->number . ' - ' .$s->firstName .' '. $s->middleName.' '. $s->lastName; ?></option>
            <?php endforeach; ?>
        </select>
		<?php if ( ! $is_lock ) : ?>
        <input type='button' value='Add Selected Students' class='btn' id="add"/>
		<?php endif; ?>
    </div>
    <div class='float-left half-width-g' >
        <select id="current-student" multiple="multiple" name="students[]" class="max-width list-selector">
            <?php foreach ($current_students as $s) : ?>
                <option value='<?php echo $s->id; ?>'><?php echo $s->number . ' - ' .$s->firstName .' '. $s->middleName.' '. $s->lastName; ?></option>
            <?php endforeach; ?>
        </select>
		<?php if ( ! $is_lock ) : ?>
         <input type='button' value='Remove Selected Students' class='btn' id="remove"/>
		 <?php endif; ?>
    </div>
    <?php if ( ! $is_lock ) : ?>
    <a href="#" class='btn btn-save'>
        <span class="btn-icon disk-icon"></span>
        <?php echo lang('save_button'); ?>
    </a>
	<?php endif; ?>
    <?php echo form_close(); ?>
    <div class='clr'></div>
    
</div>
<?php if ( ! $is_lock ) : ?>
<script>
    
    $('.btn-save').click(function(){
        
        $.each($('#current-student option'),function($k,$v){
            $(this).attr('selected','selected');
        });
        
		$('form').submit();
		return false;
	});
    
    $('#add').click(function(){
        $.each($('#available-student :selected'),function($k,$v){
            
            $('#current-student').append(
                $('<option>').attr('value',$v.value).html($v.text)
            );
            
            $('#available-student option[value="'+$v.value+'"]').remove();
            
        }) 
    });
    
    $('#remove').click(function(){
        $.each($('#current-student :selected'),function($k,$v){
            
            $('#available-student').append(
                $('<option>').attr('value',$v.value).html($v.text)
            );
            
            $('#current-student option[value="'+$v.value+'"]').remove();
            
        }) 
    });
    
    $('#available-student').dblclick(function(){
        
        $('#current-student').append(
            $('<option>').attr('value',$(this).val()).html($('option:selected',this).text())
        );
        
        $('#available-student option[value="'+$(this).val()+'"]').remove();
        
    });
    
    $('#current-student').dblclick(function(){

        $('#available-student').append(
            $('<option>').attr('value',$(this).val()).html($('option:selected',this).text())
        );
        
        $('#current-student option[value="'+$(this).val()+'"]').remove();
    });
    
    
</script>
<?php endif; ?>